const { connect } = dva;
const { Table, DatePicker: { RangePicker } } = antd;
const { BaseSearchForm } = require('../../Widgets.jsx');
import { namespace } from '../../../models/overtime/Statistics.jsx'

function SysModule (props) {
    const { searchData, dataSource, loading, dispatch } = props;
    return (
        <div style={{padding: 20}}>
            <BaseSearchForm
                loading= {loading}
                searchData={ searchData }
                searchDataLabel="统计"
                handleSearch={ (values) => dispatch({ type: `${namespace}/fetch`, payload: { pagination: { current: 1 }, searchData: values }}) }>
                <RangePicker defaultValue={moment().subtract(1, "months")} name='queryDate' label='日期' />
            </BaseSearchForm>
            <div className='search-result-list'>
                <Table
                    dataSource={dataSource}
                    pagination={false}
                    loading={loading}
                    onChange={( pagination ) => { dispatch({ type: `${namespace}/paginationLoad`, payload: { pagination }}) }}
                    bordered
                    columns={ [ {
                        title: '编号',
                        dataIndex: 'Index',
                        width: 50,
                        render: (text, record, index) => <span>{index + 1}</span>
                    }, {
                        title: '日期',
                        dataIndex: 'date'
                    }, {
                        title: '费用类型',
                        dataIndex: 'Type',
                        width: 80,
                        render: (text, record, index) => <span>福利费</span>
                    }, {
                        title: '项目（客户）名称',
                        dataIndex: 'projectName',
                        width: 120,
                        render: (text, record, index) => {
                            const week = moment(record.date).day();
                            record.projectName = week === 6 ? '周六' : (week === 0 ? '周日' : '');
                            return <span>{ record.projectName }加班订饭</span>
                        }
                    }, {
                        title: '联系人',
                        dataIndex: 'Contacts',
                        width: 80,
                        render: (text, record, index) => <span/>
                    }, {
                        title: '金额(元)',
                        dataIndex: 'num',
                        width: 100,
                        render: (text, record, index) => <span>{ text * 25 }</span>
                    }, {
                        title: '备注（事由）',
                        dataIndex: 'names',
                        render: (text, record, index) => {
                            return <span>{record.projectName}加班订饭{text}</span>
                        }
                    } ] }
                />
            </div>
        </div>
    );
}

module.exports = connect(state => {
    return { ...state[namespace], loading: state.loading.models[namespace]  }
})(SysModule);